โ โ ๋ฐฉํฅํค ๋๋ ๋ฒํผ์ผ๋ก ๋๊ธฐ์ธ์
๐
์ค์์ฌ๊ณ ์น ํ๋ก์ ํธ ๋ฐํํ
ํ ํ๊ธฐ ๋์ HTML, CSS, JavaScript๋ฅผ ๋ฐฐ์ฐ๊ณ
GitHub Pages ๋ฐฐํฌ์ Google Sheets ์๋ํ๊น์ง ๊ฒฝํํ
10๋ช
์ ๊ฐ๋ฐ์๊ฐ ๋ง๋ ์ธ์์ ๋ฐ๊พธ๋ ์์ด๋์ด
๐งบ
์ง๋ฅํ ์ธํ ์ค์ผ์ค๋ฌ
๊น๋์ฐ
"์ค๋ ๋นจ๋ํด๋ ๋ ๊น?" ๋งค๋ฒ ๊ณ ๋ฏผํ์ง ๋ง์ธ์.
- โ
์ค์๊ฐ ๋ ์จ API๋ก ๋น ์ค๋ ๋ ์ ํผํด ์ธํ ์๊ฐ ์ถ์ฒ
- โ
์ท๊ฐ ์์ฌ๋ณ ์ธํ ์ฝ์คยท๋ฌผ ์จ๋ยท๊ฑด์กฐ ๋ฐฉ๋ฒ ๋ถ์
- โ
์ค์ผ ์ ๋๊น์ง ๊ณ ๋ คํ ๋ง์ถค ์ธํ ๊ฐ์ด๋
๐ ๋ฐ๋ชจ ๋ณด๊ธฐ
๐
ฟ๏ธ
์ฃผ์ฐจ๊ณต๊ฐ ์๋ด ํ๋ก๊ทธ๋จ
์ค์ค์
๋ชฉ์ ์ง ์ฃผ๋ณ์ ๋น๋น ๋๋ ์๊ฐ, ์ด์ ๊ทธ๋ง!
- โ
๋ชฉ์ ์ง๋ฅผ ๊ณ ๋ฅด๋ฉด ์ฃผ๋ณ ๊ณต์ ์ฃผ์ฐจ์ฅ์ ์ง๋์ ํ์
- โ
Leaflet ์ง๋๋ก ์์นยท์๊ธยท๋จ์ ์๋ฆฌ ํ๋์ ํ์ธ
- โ
๋ง์ฐจ/ํผ์ก/์ฌ์ ์ํ๋ฅผ ์๊น๋ก ๊ตฌ๋ถ
๐ ๋ฐ๋ชจ ๋ณด๊ธฐ
๐ค
์ฐ๋ฆฌ๋๋ค ๊ตฌ์ธ๊ตฌ์ง ๋งค์นญ ํ๋ซํผ
ํ๋ค์ฐ
์ฒญ๋
์ทจ์
๋ฌธ์ , ์ฐ๋ฆฌ ๋๋ค์์๋ถํฐ ํ์ด์.
๋น๊ทผ๋ง์ผ์ฒ๋ผ ์ฌ์ด ๋๋ค ์ผ์๋ฆฌ ๋งค์นญ!
- โ
๋๋ค๋ณยท์
์ข
๋ณ ํํฐ๋ก ๊ฐ๊น์ด ์ผ์๋ฆฌ ๊ฒ์
- โ
์ง๋์์ ์ผ์๋ฆฌ ์์น ๋ฐ๋ก ํ์ธ
- โ
Google Sheets ์ฐ๋์ผ๋ก ์ค์๊ฐ ์ผ์๋ฆฌ ๋ฑ๋ก
๐ ๋ฐ๋ชจ ๋ณด๊ธฐ
๐
์์ต์ค ์ข์ ์์ฝ ์๋น์ค
๊น์๋ฏผ
"์๋ฆฌ ์์๊น?" ๊ฐ๋ณด์ง ์์๋ ์ ์ ์์ด์.
์ฐ๋ฆฌ ํ๊ต ์์ต์ค 140์์ ์จ๋ผ์ธ์ผ๋ก!
- โ
์ค์ ์์ต์ค ๋ฐฐ์น๋ ๊ทธ๋๋ก ๊ตฌํํ ์ข์ ์ง๋
- โ
ํด๋ฆญ ํ ๋ฒ์ผ๋ก ์์ฝ, ์ค์๊ฐ ์์ฌ์ ํ์
- โ
Google Sheets ์ฐ๋์ผ๋ก ๋ชจ๋๊ฐ ๊ฐ์ ํํฉ ๊ณต์
๐ ๋ฐ๋ชจ ๋ณด๊ธฐ
๐ก๏ธ
์ฐ๋ฆฌ๋๋ค ํญ์ผ ๋ํผ ์๋ด์ง๋
๊ณ ์์ง
ํญ์ผ์ ์ฌ๋์
๋๋ค. ๊ฐ์ฅ ๊ฐ๊น์ด ์ผํฐ๋ฅผ ์๋ ค๋๋ ค์.
- โ
์ค์๊ฐ ๊ธฐ์จ API๋ก ํญ์ผ ๋จ๊ณ ์๋ ํ์
- โ
์ง๋์์ ๋ฌด๋์์ผํฐ ์์น์ ์ด์์๊ฐ ํ์ธ
- โ
GPS ๋ด ์์น ๊ธฐ๋ฐ์ผ๋ก ๊ฐ๊น์ด ์ผํฐ ์ฐพ๊ธฐ
๐ ๋ฐ๋ชจ ๋ณด๊ธฐ
๐
๊ณต์ ๊ฐ๋ณ ์๋น์ค
์ค์ฑ์
๊ฐ๋ณ์ ํ ์ฌ๋์ ๋ชซ์ด ์๋๋ผ ๊ฐ์กฑ ๋ชจ๋์ ์ผ์ด๋๊น.
- โ
์ฝ ๋ณต์ฉ ์ฒดํฌ๋ฅผ ๊ฐ์กฑ์ด ํจ๊ป ํ์ธ (๋๊ฐ ์ฑ๊ฒผ๋์ง ํ์)
- โ
๊ฐ์กฑ ๊ณต์ ์บ๋ฆฐ๋๋ก ๋ณ์ ์์ฝยท๋ฐฉ๋ฌธ ๋น๋ฒ ๊ด๋ฆฌ + D-day ์๋ฆผ
- โ
๊ฐ๋ณ ์ผ์ง๋ก ํ์ ์ํ๋ฅผ ์จ ๊ฐ์กฑ์ด ์ค์๊ฐ ๊ณต์
๐ ๋ฐ๋ชจ ๋ณด๊ธฐ
๐ง
์น๋งคํ์ ๊ธฐ์ต ๋ณด์กฐ ์์คํ
๊น์ฑ์
๊ธฐ์ต์ด ํ๋ ค์ ธ๋, ์ฌ๋์ ํ๋ ค์ง์ง ์๋๋ก.
- โ
๊ฐ์กฑ ๋๋ฌ๋ณด๊ธฐ โ ์ผ๊ตด์ ๋๋ฅด๋ฉด ๊ทธ ์ฌ๋๊ณผ์ ์ด์ผ๊ธฐ๊ฐ ๋์์
- โ
๋ด ์ธ์ ์ง๋ โ ์ธ์์ ์ฅ์๋ค์ ์ง๋๋ก ๋์ง๋ ํ์ ์๋ฒ
- โ
ํฐ ๊ธ์จ ์๊ณยท์ผ์ ์๋ด, ์ค๋งํธ ๊ธ๋์ค ์ฐ๋๊น์ง ๋ด๋ค๋ณธ ์ค๊ณ
๐ ๋ฐ๋ชจ ๋ณด๊ธฐ
โป๏ธ
์ ์ฃผ ๋ถ๋ฆฌ์๊ฑฐ ์ค๋งํธ ์๋ฆฌ๋ฏธ
์ค์์ง
"์ค๋ ํ๋ผ์คํฑ ๋ฒ๋ฆฌ๋ ๋ ์ธ๊ฐ?" ํท๊ฐ๋ฆฌ๋ ์์ผ๋ณ ๋ฐฐ์ถ์ , ๋!
- โ
์ค๋ ๋ฒ๋ฆด ์ ์๋ ํ๋ชฉ ์๋ ํ์
- โ
ํ๋ชฉ ๊ฒ์์ผ๋ก ์ฌ๋ฐ๋ฅธ ๋ถ๋ฆฌ๋ฐฐ์ถ ๋ฐฉ๋ฒ ์๋ด
- โ
GPS + ์ง๋๋ก ๊ฐ๊น์ด ํด๋ฆฐํ์ฐ์คยท์ฌํ์ฉ๋์์ผํฐ ์ฐพ๊ธฐ
๐ ๋ฐ๋ชจ ๋ณด๊ธฐ
๐ผ
์ฅ์ ์ธ ๋ง์ถค ๊ตฌ์ง์๋น์ค
์ฅ๋๊ฒฝ
"์ค์ฆ/๊ฒฝ์ฆ" ๋ ๊ธ์๋ก๋ ๊ทธ ์ฌ๋์ ์ ์ ์์ด์.
- โ
์๊ฐยท์ฒญ๊ฐยท์ง์ฒดยท๋ฐ๋ฌ ๋ฑ ์ฅ์ ์ ํ๋ณ ์ธ๋ถํ ํํฐ
- โ
ํ์ฌ๊ฐ ์ ๊ณตํ๋ ํธ์์ง์(์คํฌ๋ฆฐ๋ฆฌ๋, ๊ฒฝ์ฌ๋ก ๋ฑ) ํ์
- โ
์ฌํ/์ถ๊ทผ ๊ทผ๋ฌด ํํ๊น์ง ๋ง์ถค ๊ฒ์
๐ ๋ฐ๋ชจ ๋ณด๊ธฐ
โฟ
ํ ์ฒด์ด ์ด๋ ์ฒดํ
๊ฐ์นํฌ
๊ณ๋จ ํ ์นธ์ด ๋๊ตฐ๊ฐ์๊ฒ๋ ์ ๋ฒฝ์ด๋ผ๋ ๊ฒ,
์ง์ ์ฒดํํด๋ณด๋ฉด ์๊ฒ ๋ฉ๋๋ค.
- โ
Three.js 3D ์ธ๊ณ์์ ์ง์ ํ ์ฒด์ด๋ฅผ ๋ชฐ์๋ณด๋ ์ฒดํ
- โ
๋๋ณด ๋ชจ๋ vs ํ ์ฒด์ด ๋ชจ๋ โ ๊ฐ์ ๊ณ๋จยทํฑ์ด ์์ ํ ๋ค๋ฅด๊ฒ ๋๊ปด์ ธ์
- โ
์ ์ฃผ ๊ด๊ด์ง ํ ์ฒด์ด ์ ๊ทผ์ฑ ์ง๋
๐ ๋ฐ๋ชจ ๋ณด๊ธฐ
๐ฑ
๊ธฐ์ ์ ์ฌ๋์ ํฅํ ๋
๊ฐ์ฅ ๋น๋ฉ๋๋ค
10๊ฐ์ ํ๋ก์ ํธ ๋ชจ๋ ์ฐ๋ฆฌ ์ฃผ๋ณ์ ์ง์ง ๋ฌธ์ ์์ ์ถ๋ฐํ์ต๋๋ค.
์ธํ ๊ณ ๋ฏผ๋ถํฐ ์น๋งค ์ด๋ฅด์ ์ ๊ธฐ์ต๊น์ง,
์ฒญ๋
์ ์ผ์๋ฆฌ๋ถํฐ ํ ์ฒด์ด ์ด์ฉ์์ ์ด๋๊ถ๊น์ง.
๋ค์ด์ฃผ์
์ ๊ฐ์ฌํฉ๋๋ค! ๐
๐ ํ๋ก์ ํธ ์ ์๊ด์ผ๋ก